﻿@{
    Layout = null;
}

@Styles.Render("~/Scripts", "~/Content")
@Scripts.Render("~/bundles/js")

<script type="text/javascript">

    $(function () {

        //初始化表格配置
        var approveTable = $('#approveTable').custromTable({
            scrollY:480,
            order: [[1, 'desc']],
            ajax: {
                url: "/InitiateFlow/GetFlowApproveInfo",
                data: function (d) {
                    return JSON.stringify(d);
                }
            },
            columns: [
                { data: 'ApproveId', visible: false },
                { data: 'FlowName',title:"工作流名称"},
                { data: 'FlowStepName', title: "步骤名称" },
                { data: 'StartUserName', title: "发起人姓名", width: 100 },
                { data: 'StartTime', title: "发起时间", width: 100 },
                {
                    title: "操作", width: 100, render: function (data, type, row, meta) {
                        var browsebtn = " <button type='button' name='browse'data-forminfoid='" + row.FormInfoId + "' data-formid='" + row.FormId + "' data-mes='" + row.ApproveId + "' class='btn btn-primary btn-xs' style='width:100px'>"
                        browsebtn += " <span class='glyphicon glyphicon-transfer' aria-hidden='true'></span> 查看/审批"
                        browsebtn += " </button>"
                        return browsebtn;
                    }
                },
                { data: 'FormId', visible: false }
            ]
        });


        $("#approveTable").on("click", "[name='browse']", function () {
            var formid = $(this).data("formid");
            var forminfoid = $(this).data("forminfoid");
            var approveid = $(this).data("mes");
            $.post("/Form/GetFormInfoByid", { formId: formid, forminfoId: forminfoid }, function (data) {
                createBrowseForm(data.elementPropertys, formid, approveid);
            }, "json")
        })

        var createBrowseForm = function (arrayPropers, formid, approveid) {
            var formElementHtml = "<form id='approveform' method='post' action='/InitiateFlow/ApproveFlow' class='form-horizontal appform'>"
            formElementHtml += " <input type='hidden' value='" + formid + "' name='formid' />"
            formElementHtml += " <input type='hidden' value='" + approveid + "' name='approveid' />"
            formElementHtml += "<div style='width:65%;float:left;height: 420px;' class='appleft'>"
            $.each(arrayPropers, function (i, v) {
                formElementHtml += "<div class='form-group'>"
                formElementHtml += "<label class='col-sm-2 control-label labsty'>" + v.ElementLable
                if (v.ElementValid == 2) {
                    formElementHtml += "<span style='color:red'>*</span>"
                }
                formElementHtml += "</label>"
                formElementHtml += "<div class='col-sm-10 pad-r20'>"
                if (v.element.ElementType == "text") {
                    formElementHtml += " <input type='text' class='form-control' value='"+v.ElementValue+"' name='" + v.FieldIden + "' placeholder='" + v.ElementLable + "'>"
                } else if (v.element.ElementType == "textarea" || v.element.ElementType == "richText") {
                    formElementHtml += "<textarea  class='form-control'  id='" + v.FieldIden + "' name='" + v.FieldIden + "' style='height:" + v.ElementHeight + "'>" + v.ElementValue + "</textarea>";
                } else if (v.element.ElementType == "dateTime") {
                    formElementHtml += "<div class='input-group date' id='" + v.FieldIden + "'>"
                    formElementHtml += "    <input type='text' class='form-control' value='" + v.ElementValue + "' name='" + v.FieldIden + "' placeholder='" + v.ElementLable + "' />"
                    formElementHtml += "    <span class='input-group-addon'>"
                    formElementHtml += "  <span class='glyphicon glyphicon-calendar'></span>"
                    formElementHtml += "</span></div>"
                } else if (v.element.ElementType == "select" || v.element.ElementType == "selectMultiple") {

                    $.ajax({
                        type: "Post",
                        url: "/Dictionary/GetDicValuebyCategoryId",
                        data: { CategoryId: v.DataDictionary },
                        dataType: "json",
                        async: false,
                        success: function (data) {
                            formElementHtml += "<select name='" + v.FieldIden + "' id='" + v.FieldIden + "' class='form-control' style='width:100%'>"
                            formElementHtml += "<option>请选择</option>"
                            $.each(data, function (di, dv) {
                                var selected = dv.ID == v.ElementValue ? "selected='selected'" : "";
                                formElementHtml += "<option " + selected + " value='" + dv.ID + "'>" + dv.DicValue + "</option>"
                            })
                            formElementHtml += "<select>"
                        }
                    })
                } else if (v.element.ElementType == "upload") {
                    formElementHtml += "<a href='/InitiateFlow/GetFlowFile?filesName=" + v.ElementValue + "' style='height:30px;line-height:30px' >" + v.ElementValue + "</a>"
                }
                formElementHtml += "</div></div>"
            })
            formElementHtml += "</div>"
            formElementHtml += "<div class='appright'>"
            formElementHtml += "   <div style='color:#9f9f9f;padding-bottom:15px;padding-top:15px'>"
            formElementHtml += "       <i style='padding-right:5px;' class='glyphicon glyphicon-info-sign'></i>"
            formElementHtml += "       <span>选择审批结果并提交</span>"
            formElementHtml += "   </div>"


            formElementHtml += " <div class='checkbox checkbox-success checkbox-inline' style='padding-left:3px'>"
            formElementHtml += "    <input type='radio' name='ApproveResult' id='radio8' checked value='1'>"
            formElementHtml += "    <label for='radio8'> 通过 </label>"
            formElementHtml += " </div>"
            formElementHtml += "  <div class='checkbox checkbox-danger checkbox-inline'>"
            formElementHtml += "     <input type='radio' name='ApproveResult' id='radio9' value='2'>"
            formElementHtml += "   <label for='radio9'> 驳回</label> "
            formElementHtml += " </div>"
       
            formElementHtml += "<div class='form-group'>"
            formElementHtml += "<div class='appRemark'>审批备注：</div>"
            formElementHtml += "<div class='col-sm-12 pad-r20'>"
            formElementHtml += "  <textarea  class='form-control' maxlength='100' name='ApproveRemark' style='height:200px;width:100%'></textarea>"
            formElementHtml += "</div></div>"
            formElementHtml += "</div>"
            formElementHtml += "</form>"

            parent.layer.open({
                type: 1,
                title: "查看或审批流程",
                area: ['700px', '550px'],
                closeBtn: 1,
                shadeClose: false,
                skin: 'layerStyle',
                content: formElementHtml,
                btn: [dditConfig.btn.close, dditConfig.btn.comfrie],
                yes: function (index, layero) {
                    var val =parent.$('[name="ApproveResult"]:checked').val();
                    flowApproveConfrim(val);
                },
                success: function (i, l) {
                    var jshtml = "function () {";
                    $.each(arrayPropers, function (i, v) {
                        if (v.element.ElementType == "dateTime") {
                            jshtml += "$('#" + v.FieldIden + "').datetimepicker({"
                            jshtml += "   format: '" + v.ElementFormatType + "',"
                            jshtml += "    widgetPositioning: {"
                            jshtml += "        horizontal: 'auto',"
                            jshtml += "        vertical: 'bottom'"
                            jshtml += "    }"
                            jshtml += "});"
                        }
                        if (v.element.ElementType == "select" || v.element.ElementType == "selectMultiple") {
                            jshtml += "$('#" + v.FieldIden + "').select2({"
                            jshtml += "placeholder: '请选择',"
                            if (v.element.ElementType == "selectMultiple") {
                                jshtml += "multiple: true,"
                            }
                            jshtml += "    minimumResultsForSearch: -1,"
                            jshtml += "});"
                        } if (v.element.ElementType == "richText") {

                            jshtml += "$('#" + v.FieldIden + "').summernote({"
                            jshtml += "    lang: 'zh-CN',"
                            jshtml += "    width: '100%',"
                            jshtml += "    height: 200,"
                            jshtml += "    focus: true,"
                            jshtml += "    dialogsInBody: true"
                            jshtml += " });"
                        }
                    })
                    //验证表单
                    jshtml += " $('#approveform').validate({"
                    jshtml += "    rules: {"
                    $.each(arrayPropers, function (i, v) {
                        if (v.ElementValid == 2) {
                            jshtml += "        " + v.FieldIden + ": {"
                            jshtml += "            required: true"
                            jshtml += "        },"
                        }
                    });
                    jshtml += "    },"
                    jshtml += "    messages: {"
                    $.each(arrayPropers, function (i, v) {
                        if (v.ElementValid == 2) {
                            jshtml += "       " + v.FieldIden + ": {"
                            jshtml += "            required: '必填'"
                            jshtml += "        },"
                        }
                    });
                    jshtml += "    },"
                    jshtml += "   highlight: dditConfig.validHighlight,"
                    jshtml += "   success: dditConfig.validSuccess,"
                    jshtml += "   errorPlacement:dditConfig.validerrorPlacement"
                    jshtml += "})"
                    jshtml += "}"
                    parent.$("#approveform").FromEvent(jshtml);
                }
            })
        }

        var flowApproveConfrim = function (istran) {

            var value = istran == "1" ? "通过" : "驳回";
            parent.layer.confirm("确定要审批‘" + value + "’工作流任务吗！", dditConfig.hintLayer, function () {
                var configForm = parent.$("#approveform");
                configForm.ajaxSubmit({
                    dataType: "json",
                    success: function (data) {
                        if (data.result) {
                            parent.layer.closeAll();
                            parent.alertify.success("操作成功！");
                            approveTable.ajax.reload(null, true);
                        } else {
                            parent.alertify.error(data.message);
                        }
                    },
                    error: function (data) {
                        var obj = eval('(' + data.responseText + ')');
                        parent.alertify.error(obj.message);
                    }
                });
            });
        }

    })
</script>

<div class="margin w100f xoverhide">
    <div class="panel panel-default" style="margin-top: 10px;">
        <ul class="list-group">
            <li class="list-group-item">
                <form class="form-inline" onsubmit="return false;">
                    <div class="form-group">
                        <label for="RoleName">流程名称</label>
                        <input type="text" class="form-control" name="workflowName" id="workflowName" placeholder="流程关键字查询">
                    </div>
                    <button type="button" class="btn btn-info " id="workflowQuery">
                        <span class="glyphicon glyphicon-search" aria-hidden="true"></span> 查询
                    </button>
                </form>
            </li>
        </ul>
    </div>
    <table id="approveTable" class="table table-bordered table-striped w100f" cellspacing="0"></table>
</div>